<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <title>收货地址</title>
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
    <link rel="stylesheet" href="/node_modules/LobsterUIFrame/weui/css/weui.css" />
    <link rel="stylesheet" href="/node_modules/LobsterUIFrame/weui/css/weuix.css" />
    <script src="/node_modules/LobsterUIFrame/weui/js/zepto.min.js"></script>
    <script src="/node_modules/LobsterUIFrame/weui/js/zepto.weui.js"></script>
    <script src="/node_modules/LobsterUIFrame/weui/js/swipe.js"></script>
    <script src="/node_modules/LobsterUIFrame/weui/js/macy.js"></script>
    <script src="/node_modules/LobsterUIFrame/weui/js/php.js"></script>
    <script src="/lobstersdk/lobster.js"></script>
    <script src="/jslib/template-web.js"></script>
    <style>
        .tip {
            font-size: 12px;
            background-color: #F7E4CD;
            height: 40px;
            line-height: 40px;
        }

        .num {
            color: #E51C23;
        }

        .bottom {
            background-color: #F5F5F5;
            position: fixed;
            bottom: 0;
            left: 0;
            right: 0;
            align-items: center;
            justify-content: center;
        }
        .weui-media-box{
            padding: 0;
        }
    </style>
</head>

<body ontouchstart>
    <div class="tip"><i class="weui-icon-warn"></i>最多可添加<span class="num">5个</span>收货地址，左滑可进行地址删除操作。</div>
    <div class="weui-cells" id="address">

    </div>
</body>

</html>

<script type="text/template" id="addresslisttemp">
    {{each list item}}
    <div class="weui-cell weui-cell_swiped item" data-item="{{item}}}">
        <div class="weui-cell__bd">
            <div class="weui-cell weui-cell_access" style="display: flex;justify-content: space-between;">
                <div class="weui-media-box weui-media-box_text" style="flex:2;">
                    <h4 class="weui-media-box__title">{{item.Addressee}} | {{item.Tel}}
                        {{if(item.IsDefault==1)}}
                        <label class="label f-white bg-green">默认</label>
                        {{/if}}
                    </h4>
                    <p class="weui-media-box__desc">{{item.AreaInfo}}</p>
                </div>
                <div>
                <a href="javascript:;" data-addressid="{{item.AddressID}}" class="btn weui-btn weui-btn_mini weui-btn_primary edit" ></i>编辑</a>
                </div>
            </div>
           
        </div>
        <div class="weui-cell__ft">
            <a data-addressid="{{item.AddressID}}" class="weui-swiped-btn weui-swiped-btn_warn delete-swipeout" href="javascript:">删除</a>
            <a data-addressid="{{item.AddressID}}" class="weui-swiped-btn weui-swiped-btn_default close-swipeout" href="javascript:">关闭</a>
        </div>
    </div>
    {{/each}}
    {{if(list.length<5)}}
    <div class="bottom">
        <a href="javascript:;" class="weui-btn weui-btn_primary" id="add">+新增收货地址</a> 
    </div>
    {{/if}}
</script>
<script>

    lobsterh5.main({
        data: {
            addressList: [], //收货地址列表
            
        },
        //初始化页面
        pageload: function () {
            this.initevent(); 
            this.getaddresslist()
        },
        //初始化事件
        initevent: function () {
            var self = this;

            $(document).on("swipeout-open", '.weui-cell_swiped', function () {
                //监听打开触发
            })
            $(document).on("swipeout-close", '.weui-cell_swiped', function () {
                //监听关闭触发
            })
            $("#address").on("click", "#add", function () {
                location.href = "edit.html"
            })
            $("#address").on("click", ".edit", function () {
                location.href = "edit.html?addressId=" + $(this).data("addressid")
            })
            $("#address").on("click", '.delete-swipeout', function () {
                var _this = $(this);
                $.confirm("您确定要删除吗?", "确认删除?", function () {
                    self.deleteaddress(_this.data("addressid")).then(res => {
                        // _this.parents('.weui-cell').remove()
                        $.toast("删除成功!");
                        self.getaddresslist();
                    })
                }, function () {
                    //取消操作
                });

            })
            $("#address").on("click", '.close-swipeout', function () {
                $(this).parents('.weui-cell').swipeout('close')
            })
           
        },
        deleteaddress(id) {
            return new Promise((resolve, reject) => {
                lobsterh5.GET("/sso/v1/patient/DelAddrss", { id: id }).then(res => {
                    resolve(res);
                }).catch(res => {
                    $.toast(res.msg, 'forbidden');
                    reject(res);
                });
            })
        },
        getaddresslist() {
            var self = this;
            lobsterh5.GET("/sso/v1/patient/GetAddressList", {}).then(res => {
                var addressList = res.addressList;
                //地址数据集添加显示字段
                if (addressList && addressList.length > 0) {
                    addressList.forEach((item, index) => {
                        //地址信息
                        var Province = item.Province ? item.Province : "";
                        var City = item.City ? item.City : "";
                        var District = item.District ? item.District : "";
                        item.AreaInfo = Province + City + District + item.Street; //地址信息
                        item.checked = item.IsDefault == 1 ? true : false; //是否为默认地址 
                    });
                    self.data.addressList = addressList;
                } else {
                    self.data.addressList = [];
                }
                var html = template("addresslisttemp", { list: self.data.addressList });
                $("#address").html(html);
                $('.weui-cell_swiped').swipeout('open')
            }).catch(res => {
                $.toast(res.msg, 'forbidden');
            })
        }
    })
</script>